<template>
  <el-dialog
    :title="title"
    :visible.sync="showChild"
    :before-close="beforeClose"
    :close-on-click-modal="false"
  >
    <div class="form-container">
      <el-form :model="zhaoBiao" ref="childForm" label-width="100px" :rules="rules">
        <div class="part-1">
          <div class="top-bar">
            <div class="top-bar-tag"></div>
            <div class="top-bar-title">招标准备</div>
          </div>
          <div class="section">
            <el-row>
              <el-col :span="12">
                <el-form-item label="招标名称">
                  <el-input v-model="temp"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="专业码">
                  <el-select v-model="temp">
                    <el-option v-for="(item,index) in zhanYeMa" :key="index" :label="item.pname"
                               :value="item.pid"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="发包方式">
                  <el-select v-model="temp">
                    <el-option v-for="(item,index) in faBaoFangShi" :key="index" :label="item.pname"
                               :value="item.pid"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="办理类型">
                  <el-select v-model="temp">
                    <el-option v-for="(item,index) in banLiLeiXing" :key="index" :label="item.pname"
                               :value="item.pid"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="招标控制价">
                  <el-input v-model="temp"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="招标类型">
                  <el-select v-model="temp">
                    <el-option v-for="(item,index) in zhaoBiaoLeiXing" :key="index" :label="item.pname"
                               :value="item.pid"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="发包(采购)人">
                  <el-input v-model="temp"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="招标代理单位">
                  <el-input v-model="temp"></el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="发布日期">
                  <el-date-picker
                    style="width: 100%;"
                    v-model="temp"
                    type="date"
                    placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="开标日期">
                  <el-date-picker
                    style="width: 100%;"
                    v-model="temp"
                    type="date"
                    placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="招标文件审批稿(Word格式)">
                  <el-button>上传</el-button>
                </el-form-item>
              </el-col>
            </el-row>

          </div>
        </div>

        <div class="part-2">
          <div class="top-bar">
            <div class="top-bar-tag"></div>
            <div class="top-bar-title">开标后</div>
          </div>
          <div class="section">

            <el-row>
              <el-col :span="12">
                <el-form-item label="中标(发包)价">
                  <el-input v-model="temp">
                    <template slot="append">万元</template>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="差额">
                  <span>0.00000000</span>万元
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="中标(承包)人">
                  <el-input v-model="temp">
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="24">
                <el-form-item label="备注">
                  <el-input type="textarea" v-model="temp">
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="24">
                <el-form-item label="招标过程材料必须上传">
                  <el-button>上传</el-button>
                  <el-button>高拍仪</el-button>
                </el-form-item>
              </el-col>
            </el-row>

          </div>
        </div>

        <!--<el-form-item prop="userName" label="用户名">
          <el-input v-model.trim="user.userName" placeholder="请输入用户名"></el-input>
        </el-form-item>
        <el-form-item prop="userNickname" label="昵称">
          <el-input v-model.trim="user.userNickname" placeholder="请输入用户昵称"></el-input>
        </el-form-item>
        <el-form-item prop="password" label="密码">
          <el-input v-model.trim="user.password" placeholder="密码由数字、字母和_下划线组成，长度在6到12位" show-password></el-input>
        </el-form-item>
        <el-form-item prop="rePassword" label="重复密码">
          <el-input v-model.trim="user.rePassword" placeholder="请再次输入密码" show-password></el-input>
        </el-form-item>
        &lt;!&ndash;        <el-form-item prop="rePassword" label="部门">
                  <el-input v-model.trim="user.rePassword" placeholder="请再次输入密码" show-password></el-input>
                </el-form-item>&ndash;&gt;
        <el-form-item prop="mobilePhone" label="手机号码">
          <el-input v-model.trim="user.mobilePhone" placeholder="请输入手机号码"></el-input>
        </el-form-item>
        <el-form-item prop="email" label="邮箱">
          <el-input v-model.trim="user.email" placeholder="请输入邮箱"></el-input>
        </el-form-item>-->
      </el-form>
    </div>
    <div slot="footer">

      <el-button type="default" @click="close">取 消</el-button>
      <el-button type="danger" @click="resetForm">重 置</el-button>
      <el-button
        type="success"
        @click="submitForm"
        :loading="changeLoading">保 存
      </el-button>

      <!--ED4014-->
    </div>
  </el-dialog>
</template>

<script>
  import userAPI from '@/api/system/user'
  import simpleValidate from '@/utils/simpleValidate'
  import paramsAPI from '@/api/system/params'

  export default {
    name: 'userCommon',
    data() {
      /*const validPwdLength = (rule, value, callback) => {
        if (this._string_.notEmpty(value) && !simpleValidate.validPwd(value)) {
          callback(new Error('密码只能由数字、字母和_下划线组成，长度在6到12位 '))
        } else {
          callback()
        }
      }
      const validPwd = (rule, value, callback) => {
        if (this.user.password !== this.user.rePassword) {
          callback(new Error('两次密码不一致'))
        } else {
          callback()
        }
      }
      const validPhone = (rule, value, callback) => {
        if (this._string_.notEmpty(value) && !simpleValidate.validPhone(value)) {
          callback(new Error('手机号码不正确'))
        } else {
          callback()
        }
      }
      const validEmail = (rule, value, callback) => {
        if (this._string_.notEmpty(value) && !simpleValidate.validEmail(value)) {
          callback(new Error('邮箱格式不正确'))
        } else {
          callback()
        }
      }*/
      return {
        zhaoBiao: {},
        // let-todo 暂时全部绑定到temp临时变量上
        temp: '',
        /*        user: {
                  userId: '',
                  userName: '',
                  userNickname: '',
                  password: '',
                  mobilePhone: '',
                  email: '',
                  rePassword: ''
                },*/
        rules: {
          /*userName: [
            { required: true, message: '请输入用户名', trigger: 'blur' }
          ],
          password: [
            { required: true, message: '请输入密码', trigger: 'blur' },
            { validator: validPwdLength, trigger: 'blur' }
          ],
          rePassword: [
            { required: true, message: '请再次输入密码', trigger: 'blur' },
            { validator: validPwd, trigger: 'blur' }
          ],
          mobilePhone: [
            { validator: validPhone, trigger: 'blur' }
          ],
          email: [
            { validator: validEmail, trigger: 'blur' }
          ]*/

        },
        parentList: [],
        showChild: false,
        title: '新增用户',
        baseSortIndex: '',
        changeLoading: false,
        tempParentId: '',

        zhanYeMa: [],
        faBaoFangShi: [],
        banLiLeiXing: [],
        zhaoBiaoLeiXing: []
      }
    },
    created() {
      // this.getParentList()
      this.getZhanYeMa()
      this.getFaBaoFangShi()
      this.getBanLiLeiXing()
      this.getZhaoBiaoLeiXing()
    },
    methods: {
      getZhanYeMa() {
        paramsAPI.zhuanYeMa().then(res => {
          this.zhanYeMa = res.result
        })
      },
      getFaBaoFangShi() {
        paramsAPI.faBaoFangShi().then(res => {
          this.faBaoFangShi = res.result
        })
      },
      getBanLiLeiXing() {
        paramsAPI.banLiLeiXing().then(res => {
          this.banLiLeiXing = res.result
        })
      },
      getZhaoBiaoLeiXing() {
        paramsAPI.zhaoBiaoLeiXing().then(res => {
          this.zhaoBiaoLeiXing = res.result
        })
      },
      close() {
        this.resetForm()
        this.showChild = false
      },

      handSortIndexChange() {

      },

      handParentChange(val) {
        this.department.sortIndex = this.getSortIndex(val)
      },
      getId(val) {
        return val.substring(0, val.indexOf('-'))
      },
      getSortIndex(val) {
        return val.substring(val.indexOf('-') + 1)
      },

      saveOrUpdate() {
        this.changeLoading = true
        const promise = this.user.userId ? userAPI.update(this.user) : userAPI.save(this.user)
        promise.then(res => {
          this.changeLoading = false
          if (res.success) {
            this.$message.success('保存成功')
            this.$emit('update')
            this.showChild = false
            this.resetForm()
          } else {
            this.$message.warning('保存失败')
          }

        }).catch(err => {
          this.changeLoading = false
          console.log(err)
        })

      },
      beforeClose(done) {
        this.resetForm()
        done(true)
      },
      getInfo(id) {
        userAPI.getById(id).then(res => {
          this.user.userId = res.result.userId
          this.user.userName = res.result.userName
          this.user.userNickname = res.result.userNickname
          this.user.mobilePhone = res.result.mobilePhone
          this.user.email = res.result.email
        }).catch(err => {
          console.log(err)
        })
      },
      open(id) {
        this.showChild = true
        /*this.user.userId = id
        if (id) {
          this.title = '编辑用户'
          this.getInfo(id)
        } else {
          this.title = '新增用户'
        }*/
      },
      getParentList() {
        departmentAPI.getList().then(res => {
          this.parentList = []
          let arr = res.result
          for (let el of arr) {
            if (el.parentId === 0) {
              let sortIndex = 1
              if (el.children.length) {
                sortIndex = el.children.length + 1
              }

              const obj = {
                id: el.departmentId + '-' + sortIndex,
                name: el.departmentName
              }
              this.parentList.push(obj)
            }
          }
          this.baseSortIndex = 0 + '-' + parseInt(arr.length + 1)
          this.department.sortIndex = arr.length + 1
          this.tempParentId = this.baseSortIndex
        }).catch(err => {
          console.log(err)
        })
      },
      resetForm() {
        this.$refs['childForm'].resetFields()
      },
      submitForm() {
        console.log('1')
        this.$refs['childForm'].validate(valid => {
          if (valid && !this.changeLoading) {
            this.saveOrUpdate()
          }
        })
      }
    }
  }
</script>

<style scoped lang="scss">

</style>

